<template>
	<view class="padding-bottom-xl bg-white">
		<u-navbar title="服务商入驻" @leftClick="leftClick" :autoBack="false" :placeholder="true" leftIconColor="#ffffff" :titleStyle="{color: '#ffffff'}" bgColor="#e00000" />
        <view class="p-l-20 p-r-20 border-box w-100 bg-white m-t-10">
            <u-search placeholder="搜索服务中心" :show-action="false" height="80rpx" bg-color="#ffffff" border-color="#707070" v-model="keyword" />
        </view>
        <view class="boxContent position-r bg-pink b-r-10 p-20 border-box m-t-10 flex" v-for="(item,index) in serviceCenterList" :key="index" @click="toDetail(item)">
          <view>
            <image class="boxImg b-r-10" src="@/static/img/index/photo.png"></image>
          </view>
          <view class="m-l-10 line-h-30">
            <view class="font-16 font-b">{{ item.centerName }}</view>
            <view class="font-13 m-t-5 line-h-40">电话：{{ $dealTel(item.centerMobile) }}</view>
            <view class="font-13 m-t-5 line-h-40 addrress">地址：{{ item.address }}</view>
          </view>
          <view class="position-a default p-l-20 p-r-20 color-w font-12 font-b bg-red1 line-h-40 text-center" v-if="item.isDefault == 1">默认</view>
          <view class="position-a default p-l-20 p-r-20 color-w font-12 font-b bg-red1 line-h-40 text-center" v-if="item.applyFor && item.isDefault != 1">申请过</view>
        </view>
        <empty text="暂无数据..." :show="serviceCenterList.length == 0" />
	</view>

</template>

<script>
    import { serviceCenterList } from '@/common/api/serviceCenter.js'
	export default {
		data() {
			return {
				keyword: null,
                serviceCenterList:[],
                allDataList:[]
			};
		},
        watch:{
            keyword:{
                handler(val){
                    let search = []
                    if(val){
                        this.allDataList.forEach(item => {
                            if(item.centerName.indexOf(val) !== -1){
                                search.push(item)
                            }
                        })
                    }else{
                        search = JSON.parse(JSON.stringify(this.allDataList))
                    }
                    this.serviceCenterList = search
                }
            }
        },
        onShow(){
            serviceCenterList().then(res => {
                if(res.code === 200) {
                    this.serviceCenterList = res.data
                    this.allDataList = JSON.parse(JSON.stringify(res.data))
                }
            })
        },
		methods: {
            // 返回处理
			leftClick(){
				let pages = getCurrentPages()
				var beforePagePath = pages[pages.length - 2].route; // 前一个页面
                if(beforePagePath === 'pages/newVoucher/addVoucher'){
                    uni.switchTab({
                        url: '/pages/my/my'
                    })
                }else if(beforePagePath === 'pages/serviceCenter/serviceCenterInfo'){
                    uni.switchTab({
                        url: '/pages/my/my'
                    })
                }else{
                    uni.navigateBack()
                }
			},
			toDetail(data){
                uni.navigateTo({
                    url: '/pages/serviceCenter/serviceCenterInfo?serviceCenterId=' + data.id
                });
            }

		}
	}
</script>

<style lang="scss" scoped>
page{
	background: #ffffff;
}
.addrress{
    min-width: 520rpx;
    max-width: 520rpx
}
.bg-pink{
    background-color: #FFE9E9;
}
.boxImg{
    width: 110rpx;
    height: 120rpx;
}
.boxContent{
    width: calc(100% - 40rpx);
    margin: 20rpx auto;
}
.default{
    top: 0;
    right: 0;
    border-bottom-left-radius: 30rpx;
    border-top-right-radius: 10rpx;
}
</style>